import React, { Component } from 'react'
import axios from "axios"
import {withRouter,RouteComponentProps} from "react-router-dom"

interface IProps  extends RouteComponentProps{

}

interface IState{
    username:string,
    pwd:string
}

class Login extends Component<IProps,IState> {
    constructor(props:any){
        super(props)
        this.state={
            username:"",
            pwd:""
        }
    }
    ChangeUser=(e:any)=>{
        this.setState({
            username:e.target.value
        })
    }
    ChangePwd=(e:any)=>{
        this.setState({
           pwd:e.target.value
        })
    }
    handClick=()=>{
        let {username,pwd}=this.state
        axios.post("/login",{
            username,pwd
        }).then(res=>{
            console.log(res);
            if(res.data.code==0){
                this.props.history.push("/home")
            }else{
                alert(res.data.mes)
            }
                
            
        })
    }
    render() {
        let {username,pwd}=this.state
        return (
            <div className="login">
                <ul>
                   <li>
                       <input 
                        type="text" 
                        placeholder='请输入账户名' 
                        value={username}
                        onChange={(e)=>{this.ChangeUser(e)}}
                        />
                   </li>
                   <li>
                       <input 
                       type="text" 
                       placeholder='请输入密码'
                       value={pwd}
                       onChange={(e)=>{this.ChangePwd(e)}}
                       />
                   </li>
                   <li><button onClick={()=>{this.handClick()}}>登录</button></li>
                   <li><a href="">忘记密码</a><a href="">新用户注册</a></li>
                </ul>
            </div>
        )
    }
}


export default withRouter(Login)
